<template>
    <app-layout>
        <view class="page" v-if="mch && mch.goods_list && mch.goods_list.length > 0">
            <view class="group">
                <app-address-bar :hasCity="previewData.hasCity" sign="gift" :allZiti="previewData.all_ziti" :address="address" @address-input="handleAddressInput"></app-address-bar>
            </view>
            <view class="group">
                <!-- 循环商户列表start -->
                <view style="padding: 26rpx 32rpx;" v-if="mch.mch.name">
                    <view class="dir-left-nowrap cross-center" style="padding: 10rpx 0;line-height: 1.2;">
                        <!-- 商户名start -->
                        <view class="box-grow-0">
                            <image src="/static/image/icon/store-black.png" class="title-icon mr-12"></image>
                        </view>
                        <view class="box-grow-1 font-bold ellipsis-1">{{mch.mch.name}}</view>
                            <view v-if="mch.mch.id > 0 &&  mch.delivery && mch.delivery.send_type === 'offline' && store && store.distance != '-m'" class="box-grow-0 dir-left-nowrap cross-center">
                                <image src="/static/image/icon/location.png" class="mr-12" style="display: block; width: 22rpx;height: 26rpx;"></image>
                                <view>距您{{store.distance}}</view>
                            </view>
                        </view><!-- 商户名end -->
                        <template v-if="mch.delivery && mch.delivery.send_type === 'offline'">
                            <!-- 自提门店信息start -->
                            <view v-if="mch.no_store && mch.no_store === true" :style="{'color': getTheme.color, 'paddding': '10rpx 0'}">暂无门店，请选择其他配送方式
                            </view>
                            <template v-else>
                                <template v-if="store">
                                    <view v-if="mch.mch.id == 0" class="dir-left-nowrap" style="padding: 10rpx 0;line-height: 1.2;">
                                        <view @click="navigateStore" class="box-grow-1 dir-left-nowrap cross-center">
                                            <view>
                                                <image src="/static/image/icon/navigation-black.png" class="title-icon mr-12"></image>
                                            </view>
                                            <view class="font-bold ellipsis-1 mr-12">
                                              {{store.name}}
                                            </view>
                                            <view class="mr-12">
                                                <image src="/static/image/icon/right.png" class="mr-12" style="width: 12rpx; height: 22rpx;"></image>
                                            </view>
                                        </view>
                                        <view v-if="store.distance != '-m' || getLocationFail" class="box-grow-0 dir-left-nowrap cross-center">
                                            <view><image src="/static/image/icon/location.png" class="mr-12" style="display: block; width: 22rpx;height: 26rpx;"></image>
                                            </view>
                                            <view v-if="getLocationFail" @click.stop="openLocationSetting" :style="{'color': getTheme.color, 'border-color': theme.border}">获取位置</view>
                                            <view v-else-if="store.distance != '-m'">距您{{store.distance}}</view>
                                        </view>
                                    </view>
                                    <view style="padding: 10rpx 0;line-height: 1.2;">
                                        <view class="font-gray ellipsis-2" style="line-height: 30rpx; max-height: 60rpx;">{{store.address}}</view>
                                    </view>
                                </template>
                                <view v-else class="dir-left-nowrap cross-center" @click="navigateStore" style="padding: 10rpx 0;">
                                    <view class="box-grow-1 dir-left-nowrap">
                                        <image src="/static/image/icon/navigation-black.png" class="title-icon mr-12"></image>
                                        <view class="mr-12 font-bold">选择门店</view>
                                    </view>
                                    <view class="box-grow-0 dir-left-nowrap cross-center">
                                        <view class="mr-12 font-gray">请选择门店</view>
                                        <image src="/static/image/icon/arrow-right.png" class="mr-12" style="width: 12rpx; height: 22rpx;"></image>
                                    </view>
                                </view>
                            </template>
                        </template><!-- 自提门店信息end -->
                    </view>
                    <view v-if="mch.show_delivery !== false" class="line"></view>
                    <view v-if="mch.show_delivery !== false" style="padding: 18rpx 32rpx;">
                    <!-- 选择配送方式start -->
                    <view class="dir-left-nowrap cross-center" style="padding: 18rpx 0;">
                        <view class="box-grow-0">
                            <image src="/static/image/icon/delivery.png" class="title-icon mr-12"></image>
                        </view>
                        <view class="box-grow-1 font-bold">配送方式</view>
                    </view>
                    <view class="dir-left-nowrap" style="padding: 18rpx 0;">
                        <view v-for="(sendType, sendTypeIndex) in mch.delivery.send_type_list" :key="sendTypeIndex" class="send-type"
                          :style="{'background-color': sendType.value == mch.delivery.send_type ? getTheme.background : '#f7f7f7'}"
                          :class="sendType.value == mch.delivery.send_type ? `theme-color` : 'app-light-gray-back' "
                          @click="changeSendType(sendType.value)">
                        {{sendType.name}}
                        </view>
                    </view>
                </view><!-- 选择配送方式end -->
                <template v-if="mch.delivery && mch.delivery.send_type === 'city' && mch.city">
                  <!-- 同城配送信息start -->
                    <view class="line"></view>
                    <view v-if="mch.city.error" class="dir-left-nowrap cross-center" style="padding: 36rpx 32rpx;">
                        <view class="box-grow-1">{{mch.city.error}}</view>
                        <view class="box-grow-0 dir-left-nowrap delivery-coverage-btn" @click="jump" style="margin: -12rpx 0;">查看配送范围</view>
                    </view>
                    <view v-else style="padding: 36rpx 32rpx;">
                        <view style="padding: 10rpx 0;">发货地址：{{mch.city.address}}</view>
                        <view class="dir-left-nowrap cross-center" style="padding: 10rpx 0;">
                            <view class="box-grow-1">
                                <view v-if="mch.city.explain">{{mch.city.explain}}</view>
                            </view>
                            <view class="box-grow-0 dir-left-nowrap delivery-coverage-btn" @click="jump">查看配送范围
                            </view>
                        </view>
                    </view>
                </template><!-- 同城配送信息end -->
                <view v-if="!mch.pick_up_enable" class="line"></view>
                <view v-if="!mch.pick_up_enable" style="height: 80rpx;line-height: 80rpx; background: #fff4f3;padding: 0 24rpx;">
                    <view>以下商品满{{mch.pick_up_price}}元起送</view>
                </view>
                <app-submit-goods :hiddenPrice="true" :theme="getTheme" plugin="gift" :list="mch"></app-submit-goods>
            </view>
            <view class="group">
                <view v-if="mch.order_form && mch.order_form.status == '1'">
                    <app-diy-form
                            :showRequiredIcon="true" 
                            v-bind:title="mch.order_form.name"
                            v-bind:list="mch.order_form.value"
                            label-position="top"
                            v-on:input="diyFormInput"
                            v-bind:show-scroll-btn="mch.order_form.show_scroll"
                    ></app-diy-form>
                </view>
                <template v-if="mch.has_goods_form">
                    <view v-for="(goodsItem, goodsIndex) in mch.goods_list" :key="goodsIndex" v-if="goodsItem.form && !goodsItem.form.same_form" class="group goods-form">
                        <view style="padding: 36rpx 32rpx;" class="font-bold">{{goodsItem.form.name}}</view>
                        <view class="line"></view>
                        <view class="row goods-list" v-if="mch.diff_goods_form_count !== 1 || previewData.mch_list.length > 1">
                            <view v-for="(subGoodsItem, subGoodsIndex) in mch.goods_list" :key="subGoodsIndex" v-if="subGoodsItem.form && subGoodsItem.form.id == goodsItem.form.id" class="dir-left-nowrap goods-item">
                                <view class="box-grow-0">
                                    <image class="goods-image" :src="subGoodsItem.goods_attr.pic_url ? subGoodsItem.goods_attr.pic_url : subGoodsItem.cover_pic"></image>
                                </view>
                                <view class="box-grow-1">
                                    <view class="goods-name ellipsis-2">{{subGoodsItem.name}}</view>
                                    <view class="dir-left-wrap">
                                        <view v-for="(attrItem,attrIndex) in subGoodsItem.attr_list" :key="attrIndex" class="mr-12 font-gray font-small">
                                            {{attrItem.attr_group_name}}:{{attrItem.attr_name}}
                                        </view>
                                    </view>
                                    <view class="dir-left-nowrap">
                                        <view class="box-grow-1 font-gray font-small">×{{subGoodsItem.num}}</view>
                                        <view class="box-grow-0">
                                            <view class="font-small" style="text-align: right" :style="{'color': theme.color}">
                                                <text v-for="(customCurrency,customCurrencyIndex) in subGoodsItem.custom_currency" :key="customCurrencyIndex">
                                                    {{customCurrency}}+
                                                </text>
                                                    ￥{{subGoodsItem.total_original_price}}
                                            </view>
                                            <view v-for="(discount,discountIndex) in subGoodsItem.discounts" :key="discountIndex" style="text-align: right" :style="{'color': theme.color}">
                                                {{discount.name}}: {{discount.value}}
                                            </view>
                                        </view>
                                    </view>
                                </view>
                            </view>
                        </view>
                        <view style="padding: 0 12rpx">
                            <app-diy-form :showRequiredIcon="true" label-position="top" :label-fs28="true" :list="goodsItem.form.value" @input="handleGoodsFormInput" @validate="handleGoodsFormValidate" :sign="`0,${goodsIndex},${goodsItem.form.id}`"></app-diy-form>
                        </view>
                    </view>
              </template>
            </view>
        </view>
        <view class="submit-bar u-bottom-fixed dir-top-nowrap safe-area-inset-bottom">
            <view class="bd-bottom dir-right-nowrap">
                <view @click="subscribe" class="submit-btn u-submit-bar-height box-grow-0 main-center cross-center" :class="[ submitLock? ' lock' : '']" :style="{'background-color': getTheme.background}">
                    <view style="background-color: transparent;color:#ffffff; text-align: center;">提交订单</view>
                </view>
            </view>
        </view>
    </app-layout>
</template>

<script>
    // import appSubimtAddress from './app-submit-address.vue';
    import {mapState} from 'vuex';
    import appEmptyBottom from '../../components/basic-component/app-empty-bottom/app-empty-bottom.vue';
    import AppDiyForm from "../../components/page-component/app-diy-form/app-diy-form";
    import appSubmitGoods from './app-submit-goods.vue';
    import AppAddressBar from "./app-address-bar";

    export default {
        name: 'address',

        data() {
            return {
                name: '',
                mobile: '',
                submitLock: false,
                previewData: {
                    hasCity: false,
                    all_ziti: false
                },
                address_id: '',
                address: {},
                goods_id: -1,
                user_order_id: 0,
                goods: [],
                store_list: [],
                store_index: 0,
                send_type: [],
                remark: '',
                store: {},
                mch: {},
                send_data: null,
                deli: '',
                loading: false,
                dis_send_type: '',
                diyForm: [],
                template_message_captain: [],
				address_disabled: true
            }
        },

        onLoad(options) { this.$commonLoad.onload(options);
            this.goods_id = options.goods_id;
            this.user_order_id = options.id;
            let url = '';
            if (options.status == 2) {
                url = this.$api.gift.join_detail
            } else if (options.status == 1) {
                url = this.$api.gift.win_detail;
            }
            this.$request({
                url: url,
                data: {
                    user_order_id: options.id,
                }
            }).then(res => {
                for (let i in res.data.detail.detail) {
                    res.data.detail.detail[i].form_data = null;
                }
                this.template_message_captain = res.data.template_message_captain;
                this.goods = res.data.detail.detail;
                let data = {
                    list: [
                        {
                            mch_id: 0,
                            goods_list: [],
                            use_integral: 0,
                            user_coupon_id: 0,
                            distance: 0,
                            remark: '',
                            order_form: [],
                        }
                    ],
                    address_id: 0
                };
                for (let i = 0; i < this.goods.length; i++) {
                    let good = {
                        id: this.goods[i].goods_id,
                        attr: [],
                        num: this.goods[i].num,
                        cat_id: 0,
                        goods_attr_id: this.goods[i].goods_attr_id,
                        cart_id: 0,
                        user_order_id: options.id,
                    };
                    let attr = [];
                    let attr_list = this.goods[i].goods_info;
                    for (let j = 0; j < attr_list.length; j++) {
                        attr.push({
                            attr_id: attr_list[j].attr_id,
                            attr_group_id: attr_list[j].attr_group_id,
                        })
                    }
                    good.attr = attr;
                    data.list[0].goods_list.push(good);
                }

                this.send_data = data;
                this.$request({
                    url: this.$api.gift.preview,
                    method: 'post',
                    data: {
                        form_data: JSON.stringify(data)
                    },
                }).then(res => {
                    if (res.code === 0) {

                        this.send_type = res.data.mch_list[0].delivery.send_type_list;
                        this.dis_send_type = res.data.mch_list[0].delivery.send_type;
                        this.mch = res.data.mch_list[0];
						if (typeof res.data.address !== 'object') {
							let addressBuff = new Buffer(res.data.address, 'base64')
							let address = addressBuff.toString('utf8');
							res.data.address = JSON.parse(address);
						}
                        this.address = res.data.address;
						this.address_disabled = res.data.address_enable;
                        this.loading = true;
                        this.changeSendType(this.send_type[0].value)
                    } else {
                        uni.showModal({
                            title: '提示',
                            content: res.msg,
                            success: function () {
                                uni.navigateBack();
                            }
                        })
                    }
                })
            });
        },

        onShow() {
            if (this.$store.state.gift.address_id && !this.$validation.isEmpty(this.send_data)) {
                let data = this.send_data;
                data.list[0].send_type = this.deli;
                data.list[0].address_id = this.$store.state.gift.address_id;
                data.address_id = this.$store.state.gift.address_id;
                this.$request({
                    url: this.$api.gift.preview,
                    method: 'post',
                    data: {
                        form_data: JSON.stringify(data)
                    },
                }).then(res => {
                    if (res.code === 0) {
                        this.send_type = res.data.mch_list[0].delivery.send_type_list;
                        this.mch = res.data.mch_list[0];
						if (typeof res.data.address !== 'object') {
							let addressBuff = new Buffer(res.data.address, 'base64')
							let address = addressBuff.toString('utf8');
							res.data.address = JSON.parse(address);
						}
                        this.address = res.data.address;
						this.address_disabled = res.data.address_enable;
                        if (this.deli === 'city') {
                            this.address =  this.mch.address;
                        }
                    } else {
                        uni.showModal({
                            title: '提示',
                            content: res.msg,
                            success: function () {
                                uni.navigateBack();
                            }
                        });
                    }
                })
            }
            if (this.$store.state.gift.store_id) {
                for (let i = 0; i < this.store_list.length; i++) {
                    if (this.store_list[i].id === this.$store.state.gift.store_id) {
                        this.store = this.store_list[i];
                    }
                }
            }
        },

        methods: {
            subscribe() {
                this.$subscribe(this.template_message_captain).then(() => {
                    this.submission();
                }).catch(() => {
                    this.submission();
                });
            },
            submission() {
                for (let i in this.goods) {
                    const item = this.goods[i];
                    if (!item.goods_form_validate_result) continue;
                    if (item.goods_form_validate_result.hasError) {
                        uni.showModal({
                            title: '提示',
                            content: item.goods_form_validate_result.errors[0].msg,
                            showCancel: false,
                        });
                        return;
                    }
                }
                uni.showLoading({
                    title: '提交中'
                });
                let data = {
                    list: [
                        {
                            mch_id: 0,
                            goods_list: [],
                            send_type: this.deli,
                            store_id: this.store.id,
                            use_integral: 0,
                            user_coupon_id: 0,
                            remark: this.remark,
                            order_form: this.diyForm,
                            address_id: this.address && this.address.id ? this.address.id : 0,
                        }
                    ],
                    address_id: this.address && this.address.id ? this.address.id : 0,
                    address: {
                        name: this.name,
                        mobile: this.mobile,
                    }
                };
                for (let i = 0; i < this.goods.length; i++) {
                    let good = {
                        id: this.goods[i].goods_id,
                        attr: [],
                        num: this.goods[i].num,
                        cat_id: 0,
                        goods_attr_id: this.goods[i].goods_attr_id,
                        cart_id: 0,
                        user_order_id: this.user_order_id,
                        form_data: this.goods[i].form_data,
                    };
                    let attr = [];
                    let attr_list = this.goods[i].goods_info;
                    for (let j = 0; j < attr_list.length; j++) {
                        attr.push({
                            attr_id: attr_list[j].attr_id,
                            attr_group_id: attr_list[j].attr_group_id,
                        })
                    }

                    good.attr = attr;
                    data.list[0].goods_list.push(good);
                }
                this.$request({
                    url: this.$api.gift.convert,
                    method: 'post',
                    data: {
                        form_data: JSON.stringify(data)
                    },
                }).then(res => {
                    if (res.code === 0) {
                        this.pay_data(res.data);
                    } else {
                        uni.hideLoading();
                        uni.showModal({
                            title: '提示',
                            content: res.msg,
                        })
                    }
                });
            },
            pay_data(data) {
                this.$request({
                    url: this.$api.order.pay_data,
                    method: 'post',
                    data: {
                        ...data,
                    }
                }).then(res => {
                    if (res.code === 0) {
                        if (res.data.hasOwnProperty('id')) {
                            let id = res.data.id;
                            if (this.mch.express_price == 0) {
                                this.$request({
                                    url: this.$api.payment.get_payments,
                                    method: 'get',
                                    data: {
                                        id: id,
                                    }
                                }).then(res => {
                                    if (res.code === 0) {
                                        this.$request({
                                            url: this.$api.payment.pay_data,
                                            method: 'get',
                                            data: {
                                                id: id,
                                                pay_type: 'balance',
                                            }
                                        }).then(res => {
                                            if (res.code === 0) {
                                                this.$request({
                                                    url: this.$api.payment.pay_buy_balance,
                                                    data: {
                                                        id: id,
                                                    }
                                                }).then(res => {
                                                    if (res.code === 0) {
                                                        uni.hideLoading();
                                                        // uni.redirectTo({
                                                        //     url: `/plugins/gift/order/order`,
                                                        // })
                                                        uni.redirectTo({
                                                            url: `/pages/order-submit/pay-result?payment_order_union_id=${id}&order_page_url=${encodeURIComponent('/plugins/gift/order/order')}`,
                                                        });
                                                    } else {
                                                        uni.hideLoading();
                                                        uni.showModal({
                                                            title: '提示',
                                                            content: res.msg,
                                                        })
                                                    }
                                                })
                                            } else {
                                                uni.hideLoading();
                                                uni.showModal({
                                                    title: '提示',
                                                    content: res.msg,
                                                })
                                            }
                                        })
                                    } else {
                                        uni.hideLoading();
                                        uni.showModal({
                                            title: '提示',
                                            content: res.msg,
                                        })
                                    }
                                })
                            } else {
                                this.$payment.pay(id).then(msg => {
                                    // 支付成功
                                    uni.hideLoading();
                                    uni.redirectTo({
                                        url: `/plugins/gift/order/order`,
                                    })
                                }).catch(msg => {
                                    // 支付失败
                                    uni.hideLoading();
                                    uni.redirectTo({
                                        url: `/plugins/gift/order/order`,
                                    })
                                });
                            }
                        } else {
                            setTimeout(() => {
                                this.pay_data(data);
                            }, 1000);
                        }
                    } else {
                        uni.hideLoading();
                        uni.showModal({
                            title: '提示',
                            content: res.msg,
                        })
                    }
                })
            },
            navigateStore() {
                uni.navigateTo({
                    url: `/pages/order-submit/store-pick?plugin=gift`
                })
            },
            jump() {
                uni.navigateTo({
                    url: `/pages/order-submit/map`,
                });
            },
            handleAddressInput(e) {
                if (typeof e.name !== 'undefined') this.name = e.name;
                if (typeof e.mobile !== 'undefined') this.mobile = e.mobile;
            },
            changeSendType(value) {
                this.deli = value;
                this.mch.delivery.send_type = value;
                this.previewData.hasCity = false;
                this.previewData.all_ziti = false;
                if(value == 'express') {
                    this.express();
                }
                if(value == 'city') {
                    this.previewData.hasCity = true;
                    this.city();
                }
                if(value == 'offline') {
                    this.previewData.all_ziti = true;
                    this.name = this.address ? this.address.name : '';
                    this.mobile = this.address ? this.address.mobile : '';
                    this.setMethod();
                }
            },

            setMethod() {
                let _this = this;
                // #ifdef MP
                uni.getLocation({
                    type: 'wgs84',
                    success: function (res) {
                        _this.$request({
                            url: _this.$api.order.store_list,
                            data: {
                                latitude: res.latitude,
                                longitude: res.longitude,
                                goods_id: _this.goods_id,
                            }
                        }).then(res => {
                            _this.store_list = res.data.list;
                            _this.store = res.data.list[0];
                        })
                    }
                });
                // #endif
                // #ifdef H5
                this.$jwx.getLocation({
                    success: function (res) {
                        _this.$request({
                            url: _this.$api.order.store_list,
                            data: {
                                latitude: res.latitude,
                                longitude: res.longitude,
                                goods_id: _this.goods_id,
                            }
                        }).then(res => {
                            _this.store_list = res.data.list;
                            _this.store = res.data.list[0];
                        });
                    }
                });
                // #endif
            },

            city() {
                let data = this.send_data;
                data.list[0].send_type = 'city';
                if (this.address && this.address.type !== 1) {
                    data.list[0].address_id = this.address.id;
                }
                this.$request({
                    url: this.$api.gift.preview,
                    method: 'post',
                    data: {
                        form_data: JSON.stringify(data)
                    },
                }).then(res => {
                    this.send_type = res.data.mch_list[0].delivery.send_type_list;
                    this.mch = res.data.mch_list[0];
                    this.address = res.data.mch_list[0].address;
                    if (this.address && this.address.type !== 1) {
                        this.address = null;
                    }
					this.address_disabled = res.data.address_enable;
                })
            },
            express() {
                let data = this.send_data;
                data.list[0].send_type = 'express';
                if (this.address) {
                    data.list[0].address_id = this.address.id;
                }
                this.$request({
                    url: this.$api.gift.preview,
                    method: 'post',
                    data: {
                        form_data: JSON.stringify(data)
                    },
                }).then(res => {
                    this.send_type = res.data.mch_list[0].delivery.send_type_list;
                    this.mch = res.data.mch_list[0];
                    this.address = res.data.mch_list[0].address;
					this.address_disabled = res.data.address_enable;
                })
            },
            diyFormInput({data}) {
                this.diyForm = data;
            },

            handleGoodsFormInput(e) {
                const signArr = e.sign.split(',');
                const goodsIndex = parseInt(signArr[1]);
                const result = [];
                for (let i in e.data) {
                    result[i] = {
                        key: e.data[i].key,
                        label: e.data[i].name,
                        value: e.data[i].value,
                        required: e.data[i].is_required,
                    };
                }
                this.goods[goodsIndex].form_data = result;
            },
            handleGoodsFormValidate(e) {
                const signArr = e.sign.split(',');
                const goodsIndex = parseInt(signArr[1]);
                this.goods[goodsIndex].goods_form_validate_result = e.result;
            },
        },

        computed: {
            ...mapState('gift', {
                theme: state => state.theme,
            }),
            getTheme: function(state) {
                return this.$storage.getStorageSync('giftThemeColor');
            },
        },

        components: {
            'app-empty-bottom': appEmptyBottom,
            'app-diy-form': AppDiyForm,
            appSubmitGoods,
            AppAddressBar
        },
    }
</script>

<style scoped lang="scss">
$submitBarHeight: #{110rpx};
$borderColor: $uni-weak-color-one;
$xWidth: #{24rpx};
$yWidth: #{24rpx};
.page {
    padding-bottom: $submitBarHeight;
    font-size: #{28rpx};
    line-height: 1;
    color: #353535;
    padding-bottom: calc(110rpx + env(safe-area-inset-bottom));
    padding-bottom: calc(110rpx + constant(safe-area-inset-bottom));
    .group {
        margin: #{20rpx} #{26rpx};
        background: #fff;
        border-radius: #{16rpx};
        overflow: hidden;
        box-shadow: 0 0 #{5rpx} rgba(0, 0, 0, 0.025);
        .title-icon {
            width: #{28rpx};
            height: #{25rpx};
            display: block;
        }
        .send-type {
            display: inline-block;
            padding: 0 0;
            height: #{56rpx};
            line-height: #{56rpx};
            width: #{190rpx};
            text-align: center;
            border-radius: #{100rpx};
            margin: 0 #{32rpx} 0 0;
            font-size: #{28rpx};
        }
    }
}
.goods-form {
    .goods-list {
        padding-top: #{12rpx};
        padding-bottom: #{12rpx};
    }

    .goods-item {
        margin: #{12rpx} 0;
    }

    .goods-image {
        width: #{200rpx};
        height: #{200rpx};
        margin-right: #{24rpx};
    }

    .goods-name {
        line-height: #{35rpx};
        height: #{70rpx};
        margin-bottom: #{32rpx};
    }
}

.u-bottom-fixed {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    z-index: 997;
    background-color: #ffffff;
    box-shadow: 0 -1rpx 20rpx -15rpx #353535;
    .bd-bottom {
        width: 750upx;
        height: 110upx;
        padding: 14upx 24upx;
    }
    .u-submit-bar-height {
      height: 82upx;
    }
    &.submit-bar {
        .price-info {
            padding: 0 0;

            >view {
                margin: #{16rpx} 0;
            }
        }

        .submit-btn {
            width: 240upx;
            text-align: center;
            border-radius: 41upx;
        }

        .submit-btn:active {
            box-shadow: inset 0 0 #{500rpx} rgba(0, 0, 0, .15);
        }

        .submit-btn.lock {
            box-shadow: inset 0 0 #{500rpx} rgba(255, 255, 255, 0.35);
        }

        .submit-btn.disabled {
            background: $uni-general-color-two;
        }
    }
}


.mr-12 {
    margin-right: #{12rpx};
}
.font-bold {
    font-weight: bold;
}

.font-small {
    font-size: #{24rpx};
}

.font-gray {
    color: #999999;
}
.ellipsis-1 {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}
.ellipsis-2 {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    text-overflow: ellipsis;
    overflow: hidden;
}
.line {
    height: 0;
    width: 100%;
    background: #e2e2e2;
    border-bottom: #{1rpx} solid #e2e2e2;
}
.theme-color {
    color: #ffffff;
}



    /* 商品页面 */
    .address {
        position: absolute;
        width: 100%;
        min-height: 100%;
        background-color: #f7f7f7;
    }

    .some-good {
        background: #ffffff;
        padding: #{28upx 24upx 0 24upx};
        overflow: hidden;

        .goods {
            height: #{156upx};
            margin-bottom: #{28upx};

            .pic {
                width: #{156upx};
                height: #{156upx};
                margin-right: #{24upx};
            }

            .content {
                width: #{522upx};
                height: #{156upx};

                .name {
                    font-size: #{32upx};
                    color: #353535;
                    line-height: #{38upx};
                }

                .attr {
                    color: #999999;
                    font-size: #{24upx};
                    line-height: 1;
                    margin-top: #{18upx};
                }

                .number {
                    color: #999999;
                    font-size: #{24upx};
                    line-height: 1;
                    margin-top: #{18upx}
                }
            }

            .address-disabled {
                background: #ffecec;
                color: #ff4544;
                position: absolute;
                bottom: 0;
                left: 0;
                right: #{22rpx};
                padding: #{12rpx} 0;
                text-align: center;
                font-size: #{20rpx};
                z-index: 100;
            }
        }
    }

    .leave-message {
        margin-top: #{24upx};
        height: #{100upx};
        line-height: #{100upx};
        padding: #{18upx 24upx};
        background-color: #ffffff;

        .textarea {
            font-size: #{32upx};
            width: 100%;
            height: 100%;
            line-height: #{64upx};
            padding: 0;
        }

        .place {
            line-height: #{64upx};
        }
    }

    .freight {
        width: #{750upx};
        background-color: #ffffff;
        padding: #{0 24upx};
        margin-top: #{20upx};
        height: #{88upx};

        text {
            font-size: #{32upx};
        }

        .text {
            color: #353535;
        }
    }
</style>